import {TabItem, Tabs} from "@astrojs/starlight/components";

import FlattenedSteps from "../../components/FlattenedSteps.astro";
import NavigationSteps from "../../components/NavigationSteps.astro";
import ZulipNote from "../../components/ZulipNote.astro";

import SquarePlusIcon from "~icons/zulip-icon/square-plus";

<Tabs>
  <TabItem label="Desktop/Web">
    <FlattenedSteps>
      <NavigationSteps target="relative/gear/channel-settings" />

      1. Click **Create channel** on the right, or click the
         **create new channel** (<SquarePlusIcon />)
         icon in the upper right.
      1. Fill out the requested information.
      1. *(optional)* Click on **Advanced configuration** to review and update
         additional channel settings.
      1. Click **Continue to add subscribers**.
      1. Add users who will be subscribed to the channel, and click **Create**.
    </FlattenedSteps>

    <ZulipNote>
      **Note**: You will only see the **Create channel** button if you have
      permission to create channels.
    </ZulipNote>
  </TabItem>

  <TabItem label="Mobile">
    Access this feature by following the web app instructions in your
    mobile device browser.

    Implementation of this feature in the mobile app is tracked [on
    GitHub](https://github.com/zulip/zulip-flutter/issues/1572). If
    you're interested in this feature, please react to the issue's
    description with 👍.
  </TabItem>
</Tabs>
